﻿<!DOCTYPE html>
<html lang="zh">

<head resource>
    <meta charset="utf-8">
    <include file="../inc/meta.inc" />
    <title>错题回顾</title>
</head>

<body>
    <div id="vapp" v-cloak>
        <template v-if="loading_init">
            <loading size="24px" type="spinner">加载中...</loading>
        </template>
        <template v-else>
            <template v-if="error!=''">
                <card>
                    <card-title icon="&#xe6fe">错误！</card-title>
                    <card-context>{{error}}</card-context>
                </card>
            </template>
            <template v-else>
                <div class="topBox">
                    <div>
                        <el-popconfirm title="确定删除该题吗？" @confirm="deleteQues()">
                            <el-link type="info" slot="reference">
                                <icon>&#xe800</icon>删除错题
                            </el-link>
                        </el-popconfirm>
                        <el-popconfirm title="确定清空当前课程下的答错的题吗？" @confirm="clearErrors()">
                            <el-link type="danger" slot="reference">
                                <icon>&#xe800</icon>清空试题
                            </el-link>
                        </el-popconfirm>
                    </div>
                    <div @click="switchmode()">
                        <span v-if="learnmode==0" icon="&#xe657"> 练习模式 </span>
                        <span v-if="learnmode==1" icon="&#xe6da"> 背题模式 </span>
                    </div>
                    <div class="move_btn">
                        <span @click="swiperight()"><icon>&#xe803</icon>上一题 </span>
                        <span @click="swipeleft()"><icon>&#xe802</icon>下一题 </span>
                    </div>
                </div>

                <!--试题区域 -->
                <template v-if="loading">
                    <loading>试题加载中...</loading>
                </template>
                <template v-else>
                    <section class="question" v-if="questions.length>0" :style="'width:'+questions.length*100+'vw'"
                        v-swiperight="swiperight" v-swipeleft="swipeleft" remark="试题区域">
                        <dl>
                            <question v-for="(q,i) in questions" :ques="q" :index="i" :total="questions.length"
                                :types="types" :mode="learnmode">
                                <template v-slot:buttons>
                                    <quesbuttons :question="q" :account="account" :couid="couid"></quesbuttons>
                                </template>
                            </question>
                        </dl>
                    </section>
                    <card v-else>
                        <card-title icon="&#xe839">没有试题！</card-title>
                        <card-context>没有供学习的试题。</card-context>
                    </card>
                </template>
                <!--答题卡 -->
                <answercard ref='answercard' :questions="questions" :types="types" :vapp="this"></answercard>
                
                <!--底部按钮区 -->
                <div class="footer">
                    <div class="correct-rate">{{count.rate}}</div>
                    <div>
                        <span class="correct-num">{{count.correct}}</span>
                        <span class="error-num">{{count.wrong}}</span>
                    </div>
                    <div class="foot-ico" id="btnCard" @click="$refs.answercard.show=true">
                        <span>{{count.answer}}</span>/{{questions.length}}
                    </div>
                </div>
            </template>
        </template>
    </div>

</body>

</html>